O layout padrão do site (HTML e CSS) que será utilizado em todas as páginas, em correspondência ao projeto de Interface elaborado anteriormente, conforme imagem abaixo (figura xx) é formado por uma área de cabeçalho, uma área principal central e um rodapé. A responsividade segue o padrão do Bootstrap.
A área de cabeçalho apresenta a logo marca da empresa; link para a página inicial, link para sistema de busca de filmes; foto do usuário logado e log-out. Quando o usuário não esta logado a área de foto do usuário e log-out torna-se link para a tela de log-in.
A área central e principal tem diferentes atribuições nas diferentes páginas do site, sendo a área principal de navegação do usuário, assim como, log-in; criação de perfil de usuário; apresentação do perfil de usuário e edição das informações; área de busca de filmes e séries e apresentação de resultados da busca; Informações detalhadas dos filmes e séries e carrousel de títulos de filmes e séries, entre outras funcionalidades que estarão detalhadas nas telas que seguem abaixo.
A área de rodapé apresenta aviso de copyright e link para as principais redes sociais: Facebook; Twitter; Instagram e Linkedin.
Para a identidade visual optou-se por um design simples, leve e fluido e a palheta de cores apresentada abaixo na figura xx.
(Figura xx)
O template criado esta disponível no link https://github.com/ICEI-PUC-Minas-PMV-ADS/pmv-ads-2022-2-e1-proj-web-t4-filmes/tree/main/src e é composto pelos seguintes layouts: